import { FC } from "react"
import { Tabs } from "antd"
import { TabPaneProps, TabsProps } from "antd/es/tabs"
const { TabPane } = Tabs

/**
 * tabs
 */

// export interface ColumnsPro extends TabPaneProps {
//   type: number | 0
// }

export interface IMutilTabsProps {
  tabsAtrrs?: TabsProps,
  columns?: TabPaneProps[] | [],
  tabValue?: string | "0"
}

const MutilTabs: FC<IMutilTabsProps> = (props) => {
  return (
    <div>
      {
        props.columns && props.columns.length > 0 ?
          <Tabs  {...props.tabsAtrrs} activeKey={props.tabValue}>
            {props.columns.map((col: TabPaneProps, index: number) => {
              return (
                <TabPane key={index} {...col}>
                  {
                    // parseInt(props.tabValue) == index ? col.children : ''tab={col.tab} className={col.className}
                    col.children
                  }
                </TabPane>
              )
            })
            }
          </Tabs> : ""
      }
    </div>
  )
}

export default MutilTabs